<template>
  <div>
    <!-- -->
    <router-view></router-view>
    <van-tabbar route active-color="#b3ffab " inactive-color="#000" :placeholder="true">
      <van-tabbar-item replace to="/index" icon="home-o">首页</van-tabbar-item>
      <van-tabbar-item replace to="/category" icon="bars">分类</van-tabbar-item>
      <van-tabbar-item replace to="/like" icon="like-o">收藏</van-tabbar-item>
      <van-tabbar-item replace to="/home" icon="manager-o">个人中心</van-tabbar-item>
    </van-tabbar>
  </div>
</template>

<script>
export default {
  name: 'Vue2Main',

  data() {
    return {

    };
  },

  mounted() {

  },

  methods: {

  },
};
</script>
<style>
.van-tabbar {
  box-shadow: 0px -2px 10px rgba(0, 0, 0, 0.3);
  background: linear-gradient(117deg, #e9defa 0%, #fbfcdb 100%);
  /* border-radius: 10px； */
}

.van-tabbar-item--active {
  background-image: linear-gradient(117deg, #fbc2eb 0%, #a6c1ee 100%);
}

.van-tabbar-item {
  font-size: 16px;
}
</style>
